@import './../../../../../node_modules/trix/dist/trix.css';

.trix-content.hidden {
  display: block !important;
  overflow: hidden;
  clip-path: inset(0 0 calc(100% - 50px) 0);
  -webkit-mask-image: linear-gradient(to bottom, black 30px, transparent 50px);
  mask-image: linear-gradient(to bottom, black 30px, transparent 50px);
  max-height: 50px;
  min-height: 0px;
}

.trix-content h1 {
  @apply text-xl font-bold mb-2;
}

.trix-content ul {
  @apply list-disc;
}

.trix-content pre {
  @apply text-base;
}

.trix-content ol {
  @apply list-decimal;
}

trix-toolbar {
  .trix-button-row {
    @apply flex-wrap gap-x-5;
  }

  .trix-button-group:not(:first-child) {
    @apply ml-0;
  }
}

/* Hack to remove border from trix when rendered from ActionText */
.trix-content {
  & .trix-content {
    border: none;
  }
}
